<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<script type="text/javascript" src="js/jquery.itextclear.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('input[type=text], input[type=password], input[type=url], input[type=email], input[type=number], textarea', '.form').iTextClear();
    });
</script>
<!-- jQplot CSS -->

<link rel="stylesheet" media="screen" href="CSS/Tree.css"/>
<!-- jQplot CSS END -->

<!-- DATATABLES CSS -->
<link rel="stylesheet" media="screen" href="lib/datatables/css/vpad.css"/>
<script type="text/javascript" src="lib/datatables/js/jquery.dataTables.js"></script>
<script type="text/javascript" src="js/Tree.js"></script>
<script type="text/javascript" src="${ctx}/js/global_util.js"></script>
<!-- DATATABLES CSS END -->

<link rel="stylesheet" type="text/css" href="${ctx}/css/tipswindown.css"/>
<script type="text/javascript" src="${ctx}/js/tipswindown.js"></script>

<h1 class="page-title">考核项目设定 - 设置 - ${pageTitle}</h1>

<div class="container_12 clearfix leading">


    <div class="side grid_12 leading">
        <form id="post-form" class="form has-validation" action="${ctx}/exam/item_create.xhtml">


            <div class="clear"></div>
            <div class="clearfix">

                <label for="examitem_title" class="form-label">考核项目 <em>*</em></label>

                <div class="form-input">
                    <input type="text" id="examitem_title" name="examitem.title" value="${examitem.title}" required="required" placeholder="请输入考核项目"/>
                </div>

            </div>
            <div class="clearfix">
                <label for="examitem_percentage" class="form-label">占比% <em>*</em></label>

                <div class="form-input">
                    <input type="text" id="examitem_percentage" name="examitem.percentage" value="${examitem.percentage}" required="required" onblur="check_percentage(this)" placeholder="请输入0-100的百分比"/>
                </div>

            </div>
            <div class="clearfix">

                <label class="form-label" for="examitem_remark">打分说明</label>

                <div class="form-input examitem_remark">
                    <span class="iTextClearButtonContainer">
                        <textarea placeholder="请输入打分规则说明" rows="5" name="examitem.remark" id="examitem_remark">${examitem.remark}</textarea>
                        <a class="iTextClearButton" style="display: none;"></a>
                    </span>
                </div>

            </div>

            <div class="clearfix">
                <label class="form-label">考核周期 <em>*</em></label>
                <div class="form-input">
                    <table class="full" style="margin-left:15px; margin-top:10px">
                        <tbody>
                        <tr>
                            <td><input id="periodType_monthly" name="examitem.periodType" type="radio" value="monthly" checked="checked"/> 月度 </td>
                            <td><input id="periodType_bimonthly" name="examitem.periodType" type="radio" value="bimonthly"/> 双月 </td>
                            <td><input id="periodType_season" name="examitem.periodType" type="radio" value="season"/> 季度 </td>
                            <td><input id="periodType_semiyearly" name="examitem.periodType" type="radio" value="semiyearly"/> 半年 </td>
                            <td><input id="periodType_annually" name="examitem.periodType" type="radio" value="annually"/> 一年 </td>
                            <td style="width:25%" class="ar">&nbsp;</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="clearfix">

                <label for="dataInput_id1" class="form-label">数据输入人 <em>*</em></label>


                <div class="form-input">
                    <div class="side grid_12" style="padding-top:10px; padding-bottom:10px">
                        <h5>
                            <span style="border: 1px solid #CCCCCC;padding: 3px 8px;display: none;" id="data_input_name"></span>
                            <input type="hidden" id="data_input_type" name="examitem.dataEntierType"/>
                            <input type="hidden" id="data_input_id" name="examitem_dataEntierTargetId" />
                        </h5>
                        <div class="accordion">
                            <header class="current">
                                <h2><input type="radio" name="r1" id="dataInput_id1"> 员工选择
                                    <button style="margin-left:230px;" class="button" type="button" onclick="setDataInputer(1)">
                                        <span class="icon" style="background:url(${ctx}/images/img/add.png)">&nbsp;</span>确认添加
                                    </button>
                                </h2>
                            </header>
                            <section class="clearfix" style="display: block;">
                                <li class="required double" style=" list-style-type:none">
                                    <a class="button" href="javascript:onShowDiv('data_input')">
                                        <span style="background:url(${ctx}/images/img/add.png)" class="icon">&nbsp;</span>选择</a>
                                    <h5></h5>
                                    <h5 id="data_input_employ_choose_name"></h5>
                                    <input type="hidden" id="data_input_employ_choose_id">
                                </li>

                            </section>
                            <header>
                                <h2><input type="radio" name="r1" id="dataInput_id2"> 职务选择
                                    <button style="margin-left:230px;" class="button" type="button" onclick="setDataInputer(2)">
                                        <span class="icon" style="background:url(${ctx}/images/img/add.png)">&nbsp;</span>确认添加
                                    </button>
                                </h2>
                            </header>
                            <section class="clearfix">
                                <li class="required double" style=" list-style-type:none">
                                    <p>
                                        筛选：
                                        <select id="input_org_sel" style="opacity: 0;" onchange="findChildren(this, 'input_org_sel')">
                                            <option value="-1">请选择部门</option>
                                            <s:iterator value="#request.organizations" var="organ">
                                                <option value="${organ.id}">${organ.fullName}</option>
                                            </s:iterator>
                                        </select>
                                        <select id="duty_sel" style="opacity: 0;">
                                            <option value="-1">请选择职务</option>
                                        </select>
                                    </p>
                                </li>
                            </section>
                        </div>
                    </div>
                </div>
            </div>

            <div class="clearfix">

                <label for="dataAudit_id1" class="form-label">数据审核人 <em>*</em></label>

                <div class="form-input">
                    <div class="side grid_12" style="padding-top:10px; padding-bottom:10px">
                        <h5>
                            <span style="border: 1px solid #CCCCCC;padding: 3px 8px;display: none;" id="data_audit_name"></span>
                            <input type="hidden" id="data_audit_type" name="examitem.dataAuditerType"/>
                            <input type="hidden" id="data_audit_id" name="examitem_dataAuditerTargetId"/>
                        </h5>
                        <div class="accordion">
                            <header class="current">
                                <h2><input type="radio" name="r2" id="dataAudit_id1"> 员工选择
                                    <button style="margin-left:230px;" class="button" type="button" onclick="setDataAuditer(1)">
                                        <span class="icon" style="background:url(${ctx}/images/img/add.png)">&nbsp;</span>确认添加
                                    </button>
                                </h2>
                            </header>
                            <section class="clearfix" style="display: block;">
                                <li class="required double" style=" list-style-type:none">
                                    <a class="button" href="javascript:onShowDiv('data_audit')">
                                        <span style="background:url(${ctx}/images/img/add.png)" class="icon">&nbsp;</span>选择</a>
                                    <h5></h5>
                                    <h5 id="data_audit_employ_choose_name"></h5>
                                    <input type="hidden" id="data_audit_employ_choose_id">
                                </li>

                            </section>
                            <header>
                                <h2><input type="radio" name="r2" id="dataAudit_id2"> 职务选择
                                    <button style="margin-left:230px;" class="button" type="button" onclick="setDataAuditer(2)">
                                        <span class="icon" style="background:url(${ctx}/images/img/add.png)">&nbsp;</span>确认添加
                                    </button>
                                </h2>
                            </header>
                            <section class="clearfix">
                                <li class="required double" style=" list-style-type:none">
                                    <p>
                                        筛选：
                                        <select id="audit_org_sel" style="opacity: 0;" onchange="findChildren(this, 'audit_org_sel')">
                                            <option value="-1">请选择部门</option>
                                            <s:iterator value="#request.organizations" var="organ">
                                                <option value="${organ.id}">${organ.fullName}</option>
                                            </s:iterator>
                                        </select>
                                        <select id="duty_sel_2" style="opacity: 0;">
                                            <option value="-1">请选择职务</option>
                                        </select>
                                    </p>
                                </li>
                            </section>
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-action clearfix">

                <input type="hidden" name="edit" value="${edit}">
                <input type="hidden" name="examitem.id" value="${examitem.id}">
                <input type="hidden" name="examQuanSet.duty.id" value="${examQuanSet.duty.id}">
                <input type="hidden" name="examQuanSet.id" value="${examQuanSet.id}">
                <input type="hidden" id="beforeRate" name="beforeRate" value="${examitem.percentage}">
                <input type="hidden" id="ap" value="${param.ap}">
                <button class="button" type="button" onclick="checkForm();">添加</button>

                <button class="button" type="reset">重置</button>
                <a class="button" href="#exam/itemset_setup_main.xhtml?examQuanSet.duty.id=${examQuanSet.duty.id}&examQuanSet.id=${examQuanSet.id}">
                    <span style="background:url(${ctx}/images/img/arrow_undo.png)" class="icon">&nbsp;</span>返回
                </a>
            </div>
        </form>
    </div>
</div>

<input id="chooce_employ_type" type="hidden">

<div class="clear"></div>

<script type="text/javascript">

    function checkForm() {
        if (checkNull($("#examitem_title").attr("value"))) {
            alert("考核项目不能为空");
            return false;
        }

        if (checkNull($("#examitem_percentage").attr("value"))) {
            alert("考核比率不能为空");
            return false;
        }

        var inputerType = $("#data_input_type").attr("value");
        var inputerId = $("#data_input_id").attr("value");
        if (checkNull(inputerId) || inputerId <= 0 || checkNull(inputerType)) {
            alert("请选择数据输入人");
            return false;
        }

        var auditerType = $("#data_audit_type").attr("value");
        var auditerId = $("#data_audit_id").attr("value");
        if (checkNull(inputerId) || inputerId <= 0 || checkNull(auditerType)) {
            alert("请选择数据审核人");
            return false;
        }

        if(inputerType == 1){
            $("#data_input_id").attr("name", "examitem.dataEntrier.id");
        }else if(inputerType == 2){
            $("#data_input_id").attr("name", "examitem.dataEntryDuty.id");
        }
        if(auditerType == 1){
            $("#data_audit_id").attr("name", "examitem.dataAuditer.id");
        }else if(auditerType == 2){
            $("#data_audit_id").attr("name", "examitem.dataAuditDuty.id");
        }


        var url = "${ctx}/exam/item_create.xhtml";
        $.ajax(url, {
            type: "POST",
            data: $("#post-form").serialize(),
            dataType:"html",
            cache:false,
            success:function(a) {
                return pageDownloaded(a, url)
            },
            complete:function() {
            }
        });
    }

    function check_percentage(obj) {
        var v = $(obj).attr("value");
        if (isNaN(v)) {
            alert("请填写正确的百分比");
            $(obj).attr("value", "");
            return;
        }

        if (v > 100 || v < 0) {
            alert("请输入0~100之间的数");
            $(obj).attr("value", "");
            return;
        }
        var ap = $("#ap").attr("value");
        if (ap == 100) {
            var beforeRate = $("#beforeRate").attr("value");
            if (v > beforeRate) {
                alert("比率超过最大值,最大值不能超过" + beforeRate);
                $(obj).attr("value", beforeRate);
                return;
            }
        } else {
            var max = 100 - ap;
            if (v > max) {
                alert("比率超过最大值,最大值不能超过" + max);
                $(obj).attr("value", max);
                return;
            }
        }


    }

    $(function() {
        var examId = "${examitem.id}";
        if (examId > 0) {
            init();
        }
    });
    function init() {
        var periodType = "${examitem.periodType}";
        $("#periodType_" + periodType).attr("checked", true);


        var dataInputType = "${examitem.dataEntierType}";
        if(dataInputType == 1){
            $("#data_input_type").val(1);
            $("#data_input_id").val("${examitem.dataEntrier.id}");
            $("#data_input_name").html("${examitem.dataEntrier.baseId.name}");
            $("#data_input_name").show();
            $("#dataInput_id1").attr("checked", true);
            $("#dataInput_id1").parent("span").addClass("checked");
        }else if(dataInputType == 2){
            $("#data_input_type").val(2);
            $("#data_input_id").val("${examitem.dataEntryDuty.id}");
            $("#data_input_name").html("${examitem.dataEntryDuty.dutyName}");
            $("#data_input_name").show();
            $("#dataInput_id2").attr("checked", true);
            $("#dataInput_id2").parent("span").addClass("checked");
        }

        var dataAuditType = "${examitem.dataAuditerType}";
        if(dataAuditType == 1){
            $("#data_audit_type").val(1);
            $("#data_audit_id").val("${examitem.dataAuditer.id}");
            $("#data_audit_name").html("${examitem.dataAuditer.baseId.name}");
            $("#data_audit_name").show();
            $("#dataAudit_id1").attr("checked", true);
            $("#dataAudit_id1").parent("span").addClass("checked");
        }else if(dataAuditType == 2){
            $("#data_audit_type").val(2);
            $("#data_audit_id").val("${examitem.dataAuditDuty.id}");
            $("#data_audit_name").html("${examitem.dataAuditDuty.dutyName}");
            $("#data_audit_name").show();
            $("#dataAudit_id2").attr("checked", true);
            $("#dataAudit_id2").parent("span").addClass("checked");
        }
    }

    //显示员工选择框
    function onShowDiv(type){
        $("#chooce_employ_type").val(type);
        tipsWindown("选择员工","url:post?${ctx}/employee/staff_list.xhtml?operation=select&organizationId=${organizationId}","900","350","true","","true","text");
    }
    //员工选择框返回事件
    function onSelectEployee(eid, ename){
        //alert(eid+"----------"+ename);
        if(eid == undefined || ename == undefined){
            return;
        }
        var type = $("#chooce_employ_type").val();
        if(type == "data_input"){
            $("#data_input_employ_choose_id").val(eid);
            $("#data_input_employ_choose_name").html(ename);
        }else if(type == "data_audit"){
            $("#data_audit_employ_choose_id").val(eid);
            $("#data_audit_employ_choose_name").html(ename);
        }
    }
    function setDataInputer(type){
        if(type == 1){
            var eid = $("#data_input_employ_choose_id").val();
            if(!checkNull(eid) && eid >0){
                $("#data_input_name").html($("#data_input_employ_choose_name").html());
                $("#data_input_id").val(eid);
                $("#data_input_type").val(type);
                $("#data_input_name").show();
            }
        } else if(type == 2){
            var did = $("#duty_sel").val();
            if(!checkNull(did) && did >0){
                $("#data_input_name").html($("#duty_sel").find("option:selected").text());
                $("#data_input_id").val(did);
                $("#data_input_type").val(type);
                $("#data_input_name").show();
            }
        }
    }

    function setDataAuditer(type){
        if(type == 1){
            var eid = $("#data_audit_employ_choose_id").val();
            if(!checkNull(eid) && eid >0){
                $("#data_audit_name").html($("#data_audit_employ_choose_name").html());
                $("#data_audit_id").val(eid);
                $("#data_audit_type").val(type);
                $("#data_audit_name").show();
            }
        } else if(type == 2){
            var did = $("#duty_sel_2").val();
            if(!checkNull(did) && did >0){
                $("#data_audit_name").html($("#duty_sel_2").find("option:selected").text());
                $("#data_audit_id").val(did);
                $("#data_audit_type").val(type);
                $("#data_audit_name").show();
            }
        }
    }


    function findChildren(obj, id){
        var parentId = $(obj).val();
        while(true){
            var next = $(obj).parent("div").next("div.xn_div");
            if(next != null && next.length > 0){
                next.remove();
            }else{
                break;
            }
        }

        $(obj).prev("span").html($(obj).find("option:selected").text());

        var temp = id.substr(0, 13);
        if(temp == "input_org_sel"){
            $("#uniform-duty_sel span:first").text("请选择职务");
        }else if(temp == "audit_org_sel"){
            $("#uniform-duty_sel_2 span:first").text("请选择职务");
        }


        if(parentId == -1){
            $("#duty_sel").html("<option value=\"-1\">请选择职务</option>");
            return;
        }

        $.getJSON("${ctx}/ajax/organization-children.xhtml?parentId="+parentId, function(children) {
            if(children != null && children.length > 0){
                var tempId = id+parentId;
                var strHTML = "<div id=\"uniform-" + tempId + "\" class=\"selector xn_div\">";
                strHTML += "<span style=\"-moz-user-select: none;\">请选择</span>";
                strHTML += "<select style='opacity: 0;' onchange='findChildren(this,\"" + tempId + "\")'>";
                strHTML += "<option value=\"-1\">请选择</option>";
                $.each(children, function (i, org) {
                    strHTML += "<option value=\"" + org.id + "\">" + org.fullName + "</option>";
                });
                strHTML += "</select></div>";
                $("#uniform-"+id).after(strHTML);
            }
        });

        loadDutyByOrgId(parentId, id);
    }

    function loadDutyByOrgId(orgId, typeId) {
        $.ajax({
            type:"post",
            url:"/ajax/duty-list.xhtml?organizationId=" + orgId,
            //data: "name=John&location=Boston",
            dataType:"json",
            success:function (data) {
                var strHTML = "<option value=\"-1\">所有职务</option>";
                if (data != null && data.length > 0) {
                    $.each(data, function (i, duty) {
                        strHTML += "<option value=\"" + duty.id + "\">" + duty.dutyName + "</option>";
                    });
                }

                var temp = typeId.substr(0, 13);
                if(temp == "input_org_sel"){
                    $("#duty_sel").html("");
                    $("#duty_sel").append(strHTML);
                }else if(temp == "audit_org_sel"){
                    $("#duty_sel_2").html("");
                    $("#duty_sel_2").append(strHTML);
                }
            }
        });
    }

    $(function(){
        //初始化小周期不能大于大周期
        var periodEnum = "${periodEnum}";
        if(periodEnum == "monthly"){//大周期为月考，小周期只能为月考
            $("#periodType_bimonthly").attr("disabled", true);
            $("#periodType_season").attr("disabled", true);
            $("#periodType_semiyearly").attr("disabled", true);
            $("#periodType_annually").attr("disabled", true);
        }else if(periodEnum == "bimonthly"){//大周期为双月考，小周期只能为月考和双月考
            $("#periodType_season").attr("disabled", true);
            $("#periodType_semiyearly").attr("disabled", true);
            $("#periodType_annually").attr("disabled", true);
        }else if(periodEnum == "season"){//大周期为季考，小周期只能为月考和季考
            $("#periodType_bimonthly").attr("disabled", true);
            $("#periodType_semiyearly").attr("disabled", true);
            $("#periodType_annually").attr("disabled", true);
        }else if(periodEnum == "semiyearly"){//大周期为半年，小周期可以为月考，双月考，季考，半年考
            $("#periodType_annually").attr("disabled", true);
        }
    });
</script>
    